﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Dokterafspraken.Master" AutoEventWireup="true" CodeBehind="DokterWizard.aspx.cs" Inherits="DokterAfspraken.DoctorPages.DokterWizard" %>


<%-- WDRO --%>
<%-- register the Ajax Control Toolkit --%>
<%@ Register TagPrefix="asp" Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit"%>
<%-- WDRO --%>


<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolderContent" runat="server">


<!-- WDRO -->
<!-- begin of Javascript section -->
    <script type="text/javascript">

        // boolean to track if a mouse button is pressed
        var mouseDown = false;

        // strings to indicate working and non-working hours
        var work = "Spreekuur";
        var play = "Vrij";

        // strings to store the IDs
        var placeHolderID = "ContentPlaceHolderContent_wizardDokter_";
        var tableID = placeHolderID + "ScheduleTable";
        var textBoxID = placeHolderID + "tbHiddenStatus";
        var debugID = placeHolderID + "tbDebug";

        // integers to store the table's dimensions
        var rowCount = 0;
        var columnCount = 0;

        // arrays to store the rows' and columns' status
        var topRowStatus = new Array();
        var firstColumnStatus = new Array();


        // basic functionality
        window.onload = function () {
            document.onselectstart = function () { return false; }      // stop text selection in IE
            document.onmousedown = function () { return false; }        // stop text selection in FF
            document.onmouseup = function () { mouseDown = false; }     // reset
        }


        // initiate table data
        function InitiateTableData() {
            var table = document.getElementById(tableID);

            rowCount = table.rows.length;
            columnCount = table.cells.length / rowCount;

            for (var i = 0; i < columnCount; i++) {
                topRowStatus[i] = true;
            }

            for (var i = 0; i < rowCount; i++) {
                firstColumnStatus[i] = true;
            }
        }


        // update the hidden value representing the individual cells' status
        function UpdateHiddenStatus(cell, char) {
            var index = parseInt(cell.id.replace(placeHolderID, ""));

            if (isNaN(index)) {
                alert("Ongeldige index. Gelieve contact op te nemen met de helpdesk.");
            } else {
                var oldHiddenStatus = document.getElementById(textBoxID).value;
                var newHiddenStatus = oldHiddenStatus.substr(0, index) + char + oldHiddenStatus.substr(index + 1);

                document.getElementById(textBoxID).value = newHiddenStatus;
                document.getElementById(debugID).value = "Index: " + index + "\n" + "OldHiddenstatus:\n" + oldHiddenStatus + "\nNewHiddenStatus:\n" + newHiddenStatus;
            }
        }


        // set dynamic cell status: the cell's status will change from work to play and vice versa
        function SetDynamicCellStatus(cell) {
            if (mouseDown) {
                if (cell.innerHTML == play) {

                    UpdateHiddenStatus(cell, "1");

                    cell.innerHTML = work;
                    cell.style.backgroundColor = "lightgreen";
                } else if (cell.innerHTML == work) {

                    UpdateHiddenStatus(cell, "0");

                    cell.innerHTML = play;
                    cell.style.backgroundColor = "white";
                } else {
                    alert("Ongeldige status. Gelieve de helpdesk te contacteren.");
                }
            }
        }


        // set static cell status: the cell's status will be set to a fixed status
        function SetStaticCellStatus(cell, workStatus) {
            if (workStatus) {

                UpdateHiddenStatus(cell, "1");

                cell.innerHTML = work;
                cell.style.backgroundColor = "lightgreen";
            } else {

                UpdateHiddenStatus(cell, "0");

                cell.innerHTML = play;
                cell.style.backgroundColor = "white";
            }
        }


        // functions for generic cells
        function MouseDown(cell) {
            mouseDown = true;
            SetDynamicCellStatus(cell);
        }

        function MouseOver(cell) {
            SetDynamicCellStatus(cell);
        }

        function MouseUp(cell) {
            mouseDown = false;
        }


        // function for cells in the top row
        function MouseDownTopCell(cell, column) {
            var status = topRowStatus[column];

            var rows = document.getElementById(tableID).rows;
            for (var i = 1; i < rows.length; i++) {
                SetStaticCellStatus(rows[i].cells[column], status);
            }

            topRowStatus[column] = !status;
        }


        // function for cells in the first column
        function MouseDownFirstCell(cell, row) {
            var status = firstColumnStatus[row];

            var cells = document.getElementById(tableID).rows[row].cells;
            for (var i = 1; i < cells.length; i++) {
                SetStaticCellStatus(cells[i], status);
            }

            firstColumnStatus[row] = !status;
        }


        // functions for calendar extenders
        function StartDateChanged(sender, args) {
            var ceEndDateID = placeHolderID + "ceEndDate";
            var ceEndDate = Sys.Application.findComponent(ceEndDateID);

            var endDate = ceEndDate.get_selectedDate();
            var startDate = sender.get_selectedDate();

            if (endDate != null && startDate > endDate) {
                alert("Opgelet: de startdatum mag niet later plaatsvinden dan de einddatum.");
                //ceEndDate.set_selectedDate(sender.get_selectedDate());
            }
            //ceEndDate.set_startDate(sender.get_selectedDate());
        }

        function EndDateChanged(sender, args) {
            var ceStartDateID = placeHolderID + "ceStartDate";
            var ceStartDate = Sys.Application.findComponent(ceStartDateID);

            var startDate = ceStartDate.get_selectedDate()
            var endDate = sender.get_selectedDate();

            if (startDate != null && endDate < startDate) {
                alert("Opgelet: de einddatum mag niet eerder plaatsvinden dan de startdatum.");
                //ceStartDate.set_selectedDate(sender.get_selectedDate());
            }
            //ceStartDate.set_endDate(sender.get_selectedDate());
        }


    </script>
    <!-- WDRO -->


    <asp:Wizard ID="wizardDokter" runat="server" ActiveStepIndex="0" Height="240px" 
        Width="728px" onfinishbuttonclick="wizardDokter_FinishButtonClick">
        <FinishNavigationTemplate>
            <asp:Button ID="FinishPreviousButton" runat="server" CausesValidation="False" 
                CommandName="MovePrevious" Text="Previous" />
            <asp:Button ID="FinishButton" runat="server" CommandName="MoveComplete" 
                Text="Finish" />
        </FinishNavigationTemplate>
        <StartNavigationTemplate>
            <asp:Button ID="StartNextButton" runat="server" CommandName="MoveNext" 
                Text="Next" onclick="StartNextButton_Click" />
        </StartNavigationTemplate>
        <StepNavigationTemplate>
            <asp:Button ID="StepPreviousButton" runat="server" CausesValidation="False" 
                CommandName="MovePrevious" Text="Previous" />
            <asp:Button ID="StepNextButton" runat="server" CommandName="MoveNext" 
                Text="Next" />
        </StepNavigationTemplate>
        <WizardSteps>
            <asp:WizardStep ID="WizardStep1" runat="server" Title="Persoonsgegevens">
            <div class="loginBox2">
            <div class="loginBox_links">
                <asp:Label ID="lblGebruikersnaam" runat="server" Text="Gebruikersnaam:"></asp:Label>
                <br />
                <asp:Label ID="lblWachtwoord" runat="server" Text="Wachtwoord:"></asp:Label>
                <br />
                <asp:Label ID="lblVoornaam" runat="server" Text="Voornaam:"></asp:Label>
                <br />
                <asp:Label ID="lblAchternaam" runat="server" Text="Achternaam:"></asp:Label>
                <br />
                <asp:Label ID="lblStraat" runat="server" Text="Straat:"></asp:Label>
                <br />
                <asp:Label ID="lblHuisnummer" runat="server" Text="Huisnr.:"></asp:Label>
                <br />
                <asp:Label ID="lblPostcode" runat="server" Text="Postcode:"></asp:Label>
                <br />
                <asp:Label ID="lblGemeente" runat="server" Text="Gemeente:"></asp:Label>
                <br />
                <asp:Label ID="lblTelefoon" runat="server" Text="Telnr.:"></asp:Label>
                <br />
                <asp:Label ID="lblGSM" runat="server" Text="GSM:"></asp:Label>
                <br />
                <asp:Label ID="lblEmail" runat="server" Text="E-mail:"></asp:Label>
                <br />
                <asp:Label ID="lblGeslacht" runat="server" Text="Geslacht:"></asp:Label>
                <br />
                <asp:Label ID="lblDuurAfspraak" runat="server" Text="Duur afspraak:"></asp:Label>
                <br />
                <asp:Label ID="lblUniekePraktijkID" runat="server" Text="Unieke praktijk ID:"></asp:Label>
                <br />
                <asp:Label ID="lblVoorboekperiode" runat="server" Text="Voorboekperiode:"></asp:Label>
                <br />
                <asp:Label ID="lblLoginVereist" runat="server" Text="Login Vereist?"></asp:Label>
                <asp:CheckBox ID="chkbLoginVereist" runat="server" CssClass="txtField" />
                </div>
                <div class="loginBox_rechts">
                <asp:TextBox ID="txtGebruikernaam" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtWachtwoord" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtVoornaam" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtAchternaam" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtStraat" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtHuisnummer" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtPostcode" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtGemeente" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtTelefoon" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtGSM" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtEmail" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:RadioButton ID="RbtnMan" runat="server" Text="M" CssClass="txtField" 
                        GroupName="geslacht" />
                <asp:RadioButton ID="rbtnVrouw" runat="server" Text="V" CssClass="txtField" 
                        GroupName="geslacht" />
                <br />
                <asp:TextBox ID="txtDuurAfspraak" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="TxtUniekePraktijkID" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                <asp:TextBox ID="txtVoorboekperiode" runat="server" CssClass="txtField"></asp:TextBox>
                <br />
                </div>
            </div>   
            </asp:WizardStep>
            <asp:WizardStep ID="WizardStep2" runat="server" Title="Werkschema">


            <!-- WDRO -->
            <!-- a ToolkitScriptManager is necessary to use the Ajax Control Toolkit controls -->
            <ajaxToolkit:ToolkitScriptManager ID="ATTSM" runat="server" />


            <br />


            <!-- a table containing the controls to set the start and end date -->
            <table>
                <tr>
                    <td width="20">
                        &nbsp;
                    </td>
                    <td>
                        <asp:Label ID="lblStartDate" runat="server" Text="Van: "></asp:Label>
                    </td>
                    <td>
                        <asp:TextBox ID="tbStartDate" runat="server"></asp:TextBox>
                        <ajaxToolkit:CalendarExtender ID="ceStartDate" runat="server" 
                            FirstDayOfWeek="Monday" TargetControlID="tbStartDate" Format="dd/MM/yyyy" 
                            PopupButtonID="imgStartDate" OnClientDateSelectionChanged="StartDateChanged">
                        </ajaxToolkit:CalendarExtender>
                    </td>
                    <td>
                        <asp:Image ID="imgStartDate" runat="server" ImageUrl="~/Images/calendar.png" />
                    </td>
                    <td width="40">
                        &nbsp;
                    </td>
                    <td>
                        <asp:Label ID="lblEndDate" runat="server" Text="Tot: "></asp:Label>
                    </td>
                    <td>
                        <asp:TextBox ID="tbEndDate" runat="server"></asp:TextBox>
                        <ajaxToolkit:CalendarExtender ID="ceEndDate" runat="server"
                            FirstDayOfWeek="Monday" TargetControlID="tbEndDate" Format="dd/MM/yyyy" 
                            PopupButtonID="imgEndDate" OnClientDateSelectionChanged="EndDateChanged">
                        </ajaxToolkit:CalendarExtender>
                    </td>
                    <td>
                        <asp:Image ID="imgEndDate" runat="server" ImageUrl="~/Images/calendar.png" />
                    </td>
                    <td width="40">
                        &nbsp;
                    </td>
                    <td>
                        <asp:Label ID="lblError" runat="server" Font-Bold="True" ForeColor="Red"></asp:Label>
                    </td>
                </tr>
            </table>


            <br />


            <!-- a table containing a placeholder for the table which represents the weekly schedule -->
            <table>
                <tr>
                    <td width="20">
                        &nbsp;
                    </td>
                    <td>
                        <asp:PlaceHolder ID="PlaceHolder_ScheduleTable" runat="server"></asp:PlaceHolder>
                    </td>
                </tr>
            </table>


            <br />


            <!-- a table containing a hidden field to store the state of the individual cells -->
            <table>
                <tr>
                    <td width="20">
                        &nbsp;
                    </td>
                    <td>
                        <asp:TextBox ID="tbHiddenStatus" runat="server" Height="30px" Width="640px"></asp:TextBox>
                    </td>
                </tr>
            </table>


            <!-- a table containing a textbox for debugging purposes -->
            <table>
                <tr>
                    <td width="20">
                        &nbsp;
                    </td>
                    <td>
                        <asp:TextBox ID="tbDebug" runat="server" Height="120px" Width="640px" TextMode="MultiLine"></asp:TextBox>
                    </td>
                </tr>
            </table>


            <br />
            <!-- WDRO -->


            </asp:WizardStep>
        </WizardSteps>
    </asp:Wizard>
</asp:Content>
